<template>

	<u-popup :show="visible">
		<view class="box">
			<view class="box-nr">
				<view class="nr-title">
					用户隐私保护协议
				</view>
				<view class="nr-n">
					<span>
						在你使用“广东德悦咨询”服务之前，请仔细阅读
						<view class="nr-y" @click="goToPrivacy">
							{{ privacyContractName }}
						</view>
						如你同意该指引，请点击“同意”开始使用本小程序
					</span>
				</view>
				
				<view class="nr-but">
					<view class="but">
						<button class="confuse_btn" @click="exitApplet">拒绝
							           			</button>
					</view>
					<view class="but">
						<button class="confirm_btn" id="agree-btn" open-type="agreePrivacyAuthorization"
							           				@agreeprivacyauthorization="handleAgreePrivacyAuthorization">同意</button>
			
					</view>
				</view>
			</view>
		</view>
	</u-popup>

</template>
<script>
	export default {
		props: {
			privacyContractName: String
		},
		data() {
			return {
				visible: false,
			}
		},
		methods: {
			// 打开隐私协议
			goToPrivacy() {
				wx.openPrivacyContract({
					success: () => {
						console.log('打开成功');
					}, // 打开成功
					fail: () => {
						uni.showToast({
							title: '打开失败，稍后重试',
							icon: 'none'
						})
					} // 打开失败
				})
			},
			// 退出小程序
			exitApplet() {
				wx.exitMiniProgram({
					success: function() {
						console.log('退出成功')
					}
				})

			},
			// 同意
			handleAgreePrivacyAuthorization() {
				console.log("我同意了")
				this.visible = false


			}
		},
	}
</script>

<style lang="less" scoped>
	
	.confirm_btn{
		background-color: #5ac725;
		color: #fff;
		font-weight: bold;
	}
	.confuse_btn{
		color: #5ac725;
	}
	.box {
		width: 100%;
		
		.box-nr {
			padding: 40rpx;

			.nr-title {
				font-weight: bold;
				font-size: 30rpx;
			}
			.nr-y{
				color: blue;
			}
			.nr-n{
				margin-top: 10rpx;
				line-height: 45rpx;
				color: #999;
			}
			.nr-but{
				padding-top: 40rpx;
				width: 80%;
				margin: 0 auto;
				display: flex;
				justify-content: space-between;
				.but{
					width: 40%;
				}
			}
		}
	}
</style>